<template>
    <div class="cell-item">
        <LabelRow v-on:onMore = "onMore" v-bind:label="label" v-bind:text="'共'+dataList.length+'条记录'"></LabelRow>
        <ul class="cell-ul">
            <div  v-for = "(item,index) in dataList" :key="index" class="cell-li">
                <div class="circle-tag">{{index+1}}</div>
                <div class="cell-label">
                    <div class="text-over flex flex1">
                        <span class="des1">{{item.handleInfo}}&nbsp;</span>
                        <span class="des2">{{item.handlePersonName}}&nbsp;</span>
                        <span class="des3">{{item.telNo}}</span>
                    </div>
                </div>
                <div>
                    <span class="warn-time">{{getTimeStr(item.createTime)}}</span>
                </div>
            </div>
            <div v-if = "!dataList.length" class="no-data">
                <img src="../../assets/no-data.png" alt="">
            </div>
        </ul>
    </div>
</template>
<script>
import LabelRow from "../common/labelRow.vue";
import {getBusinessAppointment} from "../../config/api.js";
import {getTimeStr} from "../../utils/index.js";
import Pubsub from "../../utils/pubsub";

export default {
    components: {
        LabelRow
    },
    data() {
        return {
            label: {
                url: require("../../assets/acceptWorkbench/wdyy-icon.png"),
                label: "预约记录"
            },
            dataList:[],
            getTimeStr
        };
    },
    methods:{
        onMore(){
            console.log("onMore")
        },
        getList () {
            getBusinessAppointment({pageNum: 1, pageSize: 999}).then((res = {})=>{
                this.dataList=res.rows;
            })
        }
    },
    created() {
        this.getList();
        this.pubsub_token1 = Pubsub.subscribe("BUSINESS_WX", () => {
            this.getList();
        });
    },
    destroyed() {
        this.pubsub_token1 && Pubsub.unsubscribe(this.pubsub_token1);
    }
};
</script>

<style lang="scss" scoped>
@import "../../css/unifyAcceptWorkbench.scss";
.circle-tag {
    width: 26px;
    height: 26px;
    border-radius: 15px;
    background: #1a36a9;
    color:#fff;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 20px;
}
.default{
    background-color: #e60012;
}
.normal{
    background-color: #009944;
}
.tel{
    color:#1a36a9;
    margin-right: 3px;
}
.des1{
    flex:2;
}
.des2{
    flex:1;
    text-align: center;
}
.des3{
    flex:2;
    text-align: center;
}
.warn-time{
    font-size: 14px;
    color:#888888;
}
</style>
